<template>
  <div>
    <!-- 显示数据获取次数 -->
    <div>
      <h3>数据获取次数: {{ fetchCount }}</h3>
    </div>

    <!-- 数据将自动每隔一秒更新 -->
    <div v-if="allData.data1">
      <h3>数据1</h3>
      <pre>{{ allData.data1 }}</pre>
    </div>
    <p v-else>数据1 暂无数据</p>

    <div v-if="allData.data2">
      <h3>数据2</h3>
      <pre>{{ allData.data2 }}</pre>
    </div>
    <p v-else>数据2 暂无数据</p>

    <div v-if="allData.data4">
      <h3>数据4</h3>
      <pre>{{ allData.data4 }}</pre>
    </div>
    <p v-else>数据4 暂无数据</p>

    <div v-if="allData.data5">
      <h3>数据5</h3>
      <pre>{{ allData.data5 }}</pre>
    </div>
    <p v-else>数据5 暂无数据</p>

    <div v-if="allData.data6">
      <h3>数据6</h3>
      <pre>{{ allData.data6 }}</pre>
    </div>
    <p v-else>数据7 暂无数据</p>
    <div v-if="allData.data7">
      <h3>数据7</h3>
      <pre>{{ allData.data7 }}</pre>
    </div>
    <p v-else>数据7 暂无数据</p>
    <div v-if="allData.data8">
      <h3>数据8</h3>
      <pre>{{ allData.data8 }}</pre>
    </div>
    <p v-else>数据8 暂无数据</p>
    <div v-if="allData.data9">
      <h3>数据9</h3>
      <pre>{{ allData.data9 }}</pre>
    </div>
    <p v-else>数据9 暂无数据</p>
    <div v-if="allData.data11">
      <h3>数据11</h3>
      <pre>{{ allData.data11 }}</pre>
    </div>
    <p v-else>数据11 暂无数据</p>
    <div v-if="allData.data13">
      <h3>数据13</h3>
      <pre>{{ allData.data13 }}</pre>
    </div>
    <p v-else>数据13 暂无数据</p>
    <div v-if="allData.data15">
      <h3>数据15</h3>
      <pre>{{ allData.data15 }}</pre>
    </div>
    <p v-else>数据15 暂无数据</p>
    <div v-if="allData.data17">
      <h3>数据17</h3>
      <pre>{{ allData.data17 }}</pre>
    </div>
    <p v-else>数据17 暂无数据</p>
    <div v-if="allData.data18">
      <h3>数据18</h3>
      <pre>{{ allData.data18 }}</pre>
    </div>
    <p v-else>数据18 暂无数据</p>
    <div v-if="allData.data19">
      <h3>数据19</h3>
      <pre>{{ allData.data19 }}</pre>
    </div>
    <p v-else>数据19 暂无数据</p>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      allData: {
        code:[133612, 378187, 299359, 429947, 288825, 568752, 683406, 261858, 223557, 299056],
        platform:["国泰君安证券", "通达信", "长城证券", "同花顺", "银河证券", "国联证券"],
        data1: null,
        data2: null,
        data4: null,
        data5: null,
        data6: null,
        data7: null,
        data8: null,
        data9:[],
        data10:[],
        data11:[],
        data12:[],
        data13:[],
        data14:[],
        data15:[],
        data16:[],
        data17:[],
        data18:[],
        data19:[],
      }, // 用于存储所有接口返回的数据
      fetchCount: 0, // 用于存储数据获取的次数
    };
  },
  created() {
    this.startDataFetching();
  },
  beforeDestroy() {
    this.stopDataFetching();
  },
  methods: {
    fetchData1() {
      axios.get('http://localhost:8082/getdata1')
          .then(response => {
            this.allData.data1 = response.data;
          })
          .catch(error => {
            console.error('请求 getdata1 失败:', error);
            this.allData.data1 = null;
          });
    },
    fetchData2() {
      axios.get('http://localhost:8082/getdata2')
          .then(response => {
            // console.log(response.data[0])
            this.allData.data2 = response.data;
          })
          .catch(error => {
            console.error('请求 getdata2 失败:', error);
            this.allData.data2 = null;
          });
    },
    fetchData4() {
      axios.get('http://localhost:8082/getdata4')
          .then(response => {
            this.allData.data4 = response.data;
          })
          .catch(error => {
            console.error('请求 getdata4 失败:', error);
            this.allData.data4 = null;
          });
    },
    fetchData5() {
      axios.get('http://localhost:8082/getdata5')
          .then(response => {
            // 提取核心数据，生成新的数组
            // console.log(response.data[0].score)
            this.allData.data5 = response.data.map(item => ({
              score: item.score,
              value: item.value
            }));
          })
          .catch(error => {
            console.error('请求 getdata5 失败:', error);
            this.allData.data5 = null;
          });
    },
    fetchData6() {
      axios.get('http://localhost:8082/getdata6')
          .then(response => {
            // console.log(response.data[0]._1)
            this.allData.data6 = response.data;
          })
          .catch(error => {
            console.error('请求 getdata6 失败:', error);
            this.allData.data6 = null;
          });
    },
    fetchData7() {
      axios.get('http://localhost:8082/getdata7')
          .then(response => {
            // console.log(response.data[0]._1)
            this.allData.data7 = response.data;
          })
          .catch(error => {
            console.error('请求 getdata7 失败:', error);
            this.allData.data7 = null;
          });
    },
    fetchData8() {
      axios.get('http://localhost:8082/getdata8')
          .then(response => {
            this.allData.data8 = response.data; // 存储data8的数据
          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data8 = null;
          });
    },
    fetchData9() {
      axios.get('http://localhost:8082/getdata9')
          .then(response => {
            this.allData.data10[0] = response.data[3 * this.fetchCount + 0];
            this.allData.data10[1] = response.data[3 * this.fetchCount + 1];
            this.allData.data10[2] = response.data[3 * this.fetchCount + 2];
            if(this.fetchCount<=60){
              this.allData.data9[0] = response.data[3 * this.fetchCount + 0];
              this.allData.data9[1] = response.data[3 * this.fetchCount + 1];
              this.allData.data9[2] = response.data[3 * this.fetchCount + 2];
            }
            else{
              this.allData.data9[0] = response.data[3 * this.fetchCount + 0];
              this.allData.data9[1] = response.data[3 * this.fetchCount + 1]-response.data[3 * (this.fetchCount-60) + 1];
              this.allData.data9[2] = response.data[3 * this.fetchCount + 2]-response.data[3 * (this.fetchCount-60) + 2];
            }


          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data9 = null;
          });
    },
    fetchData10() {
      axios.get('http://localhost:8082/getdata10')
          .then(response => {
            this.allData.data12[0] = response.data[3 * this.fetchCount + 0];
            this.allData.data12[1] = response.data[3 * this.fetchCount + 1];
            this.allData.data12[2] = response.data[3 * this.fetchCount + 2];
            if(this.fetchCount<=60){
              this.allData.data11[0] = response.data[3 * this.fetchCount + 0];
              this.allData.data11[1] = response.data[3 * this.fetchCount + 1];
              this.allData.data11[2] = response.data[3 * this.fetchCount + 2];
            }
            else{
              this.allData.data11[0] = response.data[3 * this.fetchCount + 0];
              this.allData.data11[1] = response.data[3 * this.fetchCount + 1]-response.data[3 * (this.fetchCount-60) + 1];
              this.allData.data11[2] = response.data[3 * this.fetchCount + 2]-response.data[3 * (this.fetchCount-60) + 2];
            }


          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data9 = null;
          });
    },
    fetchData11() {
      axios.get('http://localhost:8082/getdata11')
          .then(response => {
            // 更新data14数组，每次取11个数据项
            for (let i = 0; i < 11; i++) {
              this.allData.data14[i] = response.data[11 * this.fetchCount + i];
            }

            // 如果fetchCount小于或等于60，直接更新data13数组
            if (this.fetchCount <= 60) {
              for (let i = 0; i < 11; i++) {
                this.allData.data13[i] = response.data[11 * this.fetchCount + i];
              }
            }
            // 如果fetchCount大于60，更新data13数组，并对其中的部分数据进行累减
            else {
              for (let i = 0; i < 11; i++) {
                if (i < 10) { // 最后一个数据项不需要累减
                  this.allData.data13[i] = response.data[11 * this.fetchCount + i] - response.data[11 * (this.fetchCount - 60) + i];
                } else { // 最后一个数据项直接赋值
                  this.allData.data13[i] = response.data[11 * this.fetchCount + i];
                }
              }
            }

            // 构造newData，排除第一个元素（时间）
            const codes = [133612, 378187, 299359, 429947, 288825, 568752, 683406, 261858, 223557, 299056];
            const values = this.allData.data13.slice(1); // 跳过第一个元素
            const newData = codes.map((code, index) => ({
              name: `${code}`,
              value: values[index] // 使用跳过第一个元素后的values数组
            }));

            // 根据value对newData进行排序
            const sortedData = newData.sort((a, b) => b.value - a.value);

            // 打印sortedData或者根据需要进行其他操作
            console.log(sortedData);
          })
          .catch(error => {
            console.error('请求 getdata11 失败:', error);
            this.allData.data11 = null; // 这里假设您想要将data11设置为null
          });
    },
    fetchData12() {
      axios.get('http://localhost:8082/getdata12')
          .then(response => {
            // 更新data16数组，每次取7个数据项
            for (let i = 0; i < 7; i++) {
              this.allData.data16[i] = response.data[7 * this.fetchCount + i];
            }

            // 如果fetchCount小于或等于60，直接更新data15数组
            if (this.fetchCount <= 60) {
              for (let i = 0; i < 7; i++) {
                this.allData.data15[i] = response.data[7 * this.fetchCount + i];
              }
            }
            // 如果fetchCount大于60，更新data15数组，并对其中的部分数据进行累减
            else {
              for (let i = 0; i < 7; i++) {
                if (i < 6) { // 最后一个数据项不需要累减
                  this.allData.data15[i] = response.data[7 * this.fetchCount + i] - response.data[7 * (this.fetchCount - 60) + i];
                } else { // 最后一个数据项直接赋值
                  this.allData.data15[i] = response.data[7 * this.fetchCount + i];
                }
              }
            }
          })
          .catch(error => {
            console.error('请求 getdata12 失败:', error);
            this.allData.data15 = null; // 这里假设您想要将data15设置为null
          });
    },
    fetchData13() {
      axios.get('http://localhost:8082/getdata13')
          .then(response => {
            this.allData.data17 = response.data[this.fetchCount];

          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data17 = null;
          });
    },
    fetchData14() {
      axios.get('http://localhost:8082/getdata14')
          .then(response => {
            // this.allData.data18 = response.data[this.fetchCount]; // 存储data8的数据
            for (let i = 0; i < 32; i++) {
              this.allData.data18[i] = response.data[32 * this.fetchCount + i];
            }// 存储data8的数据
          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data18 = null;
          });
    },
    fetchData15() {
      axios.get('http://localhost:8082/getdata15')
          .then(response => {
            for (let i = 0; i < 8; i++) {
              this.allData.data19[i] = response.data[8 * this.fetchCount + i];
            }

          })
          .catch(error => {
            console.error('请求 getdata8 失败:', error);
            this.allData.data17 = null;
          });
    },
    startDataFetching() {
      this.intervalId = setInterval(() => {
        this.fetchData1();
        this.fetchData2();
        this.fetchData4();
        this.fetchData5();
        this.fetchData6();
        this.fetchData7();
        this.fetchData8();
        this.fetchData9();
        this.fetchData10();
        this.fetchData11();
        this.fetchData12();
        this.fetchData13();
        this.fetchData14();
        this.fetchData15();
        this.fetchCount++; // 每次获取数据时增加获取次数
      }, 1000); // 每隔1000毫秒（1秒）执行一次
    },
    stopDataFetching() {
      clearInterval(this.intervalId);
    }
  }
};
</script>

<style>
/* 你可以在这里添加一些样式 */
.el-button {
  margin: 10px;
  padding: 10px 20px;
}
</style>
